<template>
  <div class="app-container">
    <h3>动态组件加载tabs</h3>
    <!-- 动态统计模块 -->
    <BaseHScroll :current-component="currentComponent" :scroll-list="scrollList" @onScrollItemClick="onScrollItemClick" />
  </div>
</template>

<script>
import itemContainer from './itemContainer'

export default {
  name: 'A002Hscroll',
  data() {
    return {
      currentComponent: itemContainer,
      scrollList: []

    }
  },
  created() {
    this.$bus.$on('onScrollItemClick', this.onScrollItemClick)
    setTimeout(() => {
      const bgArr = ['#c0c4cc', '#46a6fd', '#faebd7', '#13ce66', '#e6a700']
      let count = 0
      for (let index = 0; index < 30; index++) {
        if (count === bgArr.length) {
          count = 0
        }
        this.scrollList.push({ id: index, name: '余胜灵' + index, bg: bgArr[count] })
        count++
      }
    }, 100)
  },
  mounted() {
  },
  methods: {
    onScrollItemClick(data) {
      console.log('onScrollItemClick', data)
    },
    onScrollClick(data) {
      console.log('onScrollItemClick:', data)
    }

  }
}
</script>

<style>

</style>
